Vue.component('task-item', {
//	template:  `<li class="mui-table-view-cell FONT_F3 COL_C3" @click="showDetail(item_data,$event)">\
//					<div class="div_taskitem">\
//						<task-name v-bind:item_data="item_data"></task-name>\
//				    	<task-time v-bind:item_data="item_data"></task-time>\
//			   			<task-info v-bind:item_data="item_data" v-if="item_data.rwzt == '2000805' || item_data.rwzt == '2000803' || item_data.rwzt == '2000804'"></task-info>\
//					</div>\
//					<span class="mui-icon icon-arrowright"></span>\
//				</li>`,
	props: ['item_data'],
	render: function(h) {
		var $this = this;
		var mitems = [];
		var name = h(TaskName, {
                    props: {
                        item_data: $this.item_data
                    }
                });
        var time = h(TaskTime, {
                    props: {
                        item_data: $this.item_data
                    }
                });
       	var info = h(TaskInfo, {
                    props: {
                        item_data: $this.item_data
                    }
                });
		mitems.push(name);
		mitems.push(time);
		if($this.item_data.rwzt == '2000805' ||
			$this.item_data.rwzt == '2000803' ||
			$this.item_data.rwzt == '2000804'){
			mitems.push(info);
		}

        return h('li', {
            'class': 'mui-table-view-cell FONT_F3 COL_C3',
            on: {
            	click: function(e){
				  	$this.showDetail($this.item_data, e)
				}
            }
        }, [
            h('div', {
                'class': 'div_taskitem'
            }, mitems),
            h('span', {
                'class': 'mui-icon icon-arrowright'
            })
        ])
    },
	methods: {
		showDetail: function(item,$event){
			var params = {
				"params": {
					"rwid": item.id
				}
			}
			
			ajax(CHANGE_MESSAGE_STATE, params, function(data) {
				if(data.successful === "true") {
					mui.fire(plus.webview.getWebviewById("message.html"), 'reloadView');
					var target = plus.webview.getWebviewById("index.html");
			        mui.fire(target,"getMessageCount");
				} else {
					mui.toast(data.resultHint);
				}
			});
			plus.commonJsBridgeService.execSync('VoiceService','pauseTTS', {
			     dqbz: "1"
			});
			jumpTo("../task/taskDetail/taskDetail.html","taskDetail.html",jumpPopIn,{
				state: item.rwzt,
				projectId: item.id
			});
		}
	}
}); 

var TaskName = Vue.component('task-name',{
	props: ['item_data'],
	render: function(h){
		return h('div',{
			'class': 'task_name'
		},[
			h('span',{
				'class': 'iconfont icon-dianxiangan COL_GREEN icon_taskitem'
			}),
			h('span',{
				'class': 'span_name mui-ellipsis ' + this.getClassNameByType()
			},this.item_data.taskname),
			h('span',{
				'class': 'task_type ' + this.getClassNameByType()
			},this.item_data.type),
			h('span',{
				'class': 'iconfont icon_taskitem ' + this.getClassNameByState()
			})
		])
	},
	methods:{
		getClassNameByType: function(){
			var type = this.item_data.type;
			if(type == '特殊巡视'){
				return 'COL_YELLOW';
			}else{
				return 'COL_GREEN';
			}
		},
		
		getClassNameByState: function(){
			var state = this.item_data.rwzt;
			var className = '';
			switch(state){
				case '2000805':  //暂停
					className = 'icon-stop';
					break;
				case '2000802':  //未执行
					className = 'icon-more_light';
					break;
				case '2000801':  //草稿
					className = 'icon-yijianfankui';
					break;
				case '2000804':  //已完成
					className = 'icon-appreciate';
					break;
				case '2000803':  //进行中
					className = 'icon-playfill';
					break;
			}
			return className;
		}
	}
});

var TaskTime = Vue.component('task-time', {
	props: ['item_data'],
	render: function(h){
		return h('div',{
			'class': 'task_time'
		},[
			h('span',{
				'class': 'iconfont icon-shijian COL_GREEN icon_taskitem'
			}),
			h('span',{
				'class': 'span_time FONT_F5'
			},[
				this.item_data.starttime,
				h('span',{
					'class': 'span_margin'
				},'至'),
				this.item_data.endtime
			])
		])
	}
});

var TaskInfo = Vue.component('task-info',{
	props:['item_data'],
	render: function(h){
		return h('div',{
			'class': 'task_info FONT_F5'
		},[
			h('span',{
				'class': 'iconfont icon-warn COL_GREEN icon_taskitem'
			}),
			h('span',{
				'class': 'info_item'
			},[
				'危急',
				h('span',{
					'class': 'COL_RED'
				},this.item_data.wj)
			]),
			h('span',{
				'class': 'info_item'
			},[
				'严重',
				h('span',{
					'class': 'COL_YELLOW'
				},this.item_data.yz)
			]),
			h('span',{
				'class': 'info_item'
			},[
				'一般',
				h('span',{
					'class': 'COL_GREEN'
				},this.item_data.yb)
			])
		])
	}
});